<template>
<!--处理公共模块-->
    <div>
        <TitleBar :title="title" :needBack="false"/>
        <Carousel/>
        <HistoryList :data="historyList"/>
        <!--底部菜单栏显示-->
        <MenuBar  index="1"/>
    </div>
</template>

<script lang="ts">
    import {Component, Vue, Provide, Prop} from "vue-property-decorator"
    import TitleBar from '@/pages/common/TitleBar.vue'
    import Carousel from '@/pages/common/Carousel.vue'
    import HistoryList from '@/pages/home/components/HistoryList.vue'
    import MenuBar from '@/pages/common/MenuBar.vue'
    import  axios from 'axios'
    @Component({
            components:{
                TitleBar,
                Carousel,
                HistoryList,
                MenuBar
            }
    })
    export default class HomePage extends Vue{
        //props
        @Provide() title = '菠菜首页';

        // @Prop([])historyList!: string;
        historyList!: string
        data() {
            return {
                historyList: this.historyList,
            }
        }

        //请求数据 mouted
        mounted() {
            console.log("发送请求")
            axios.get('/api/index').then(resp=>{
                this.historyList = resp.data.data
            }).catch((err)=>{
                console.log(err)
            });
        }
    }

</script>

<style scoped>

</style>